import 'package:flutter/material.dart';
import 'package:qimeng/colorall.dart';
import 'package:qimeng/colorgame.dart';
import 'package:qimeng/setting.dart';

import 'Zimugame.dart';

class Home extends StatefulWidget {
  const Home({super.key});

  @override
  State<Home> createState() => _HomeState();
}

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    final PageController controller = PageController(viewportFraction: 0.55);
    int count = 0;
    return Scaffold(
      backgroundColor: Kbgcolor,
      appBar: AppBar(
        elevation: 0,
        scrolledUnderElevation: 0,
        backgroundColor: Kbgcolor,
        actions: [
          InkWell(
            onTap: () {
              // setting
              Navigator.push(context, MaterialPageRoute(builder: (context) {
                return setting();
              }));
            },
            child: Image.asset('assets/切图/组 68.png'),
          )
        ],
      ),
      body: Column(
        children: [
          Image.asset(
            'assets/切图/组 76.png',
            scale: 2,
          ),
          SizedBox(
            height: size.height * 0.10,
          ),
          Container(
            height: size.height * 0.4,
            width: size.width,
            child: PageView(
              controller: controller,
              onPageChanged: (value) {
                print(value);
                setState(() {
                  count = value;
                });
              },
              children: [
                gameitem(
                  color: Color(0xff3C5C75),
                  size: size,
                  img: 'assets/切图/item-2.png',
                  text: '认数字',
                  select: count == 0,
                  widget: ColorGame(),
                ),
                gameitem(
                  color: Color(0xff7D4775),
                  size: size,
                  img: 'assets/切图/item-3.png',
                  text: '认颜色',
                  select: count == 1,
                  widget: ColorGame(),
                ),
                gameitem(
                  color: Color(0xff3EC5BF),
                  size: size,
                  img: 'assets/切图/item-1.png',
                  text: '认字母',
                  select: count == 2,
                  widget: ZimuGame(),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

class gameitem extends StatelessWidget {
  final String img;
  final String text;
  final Color color;
  final bool select;
  final Widget widget;
  const gameitem({
    super.key,
    required this.size,
    required this.img,
    required this.text,
    required this.color,
    this.select = false,
    required this.widget,
  });

  final Size size;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        Navigator.push(context, MaterialPageRoute(builder: (context) {
          return widget;
        }));
      },
      child: Container(
        // color: Colors.lightGreenAccent,
        // height: size.width * 0.4,
        margin: EdgeInsets.symmetric(horizontal: 10),
        child: Column(
          children: [
            Image.asset(
              img,
              fit: BoxFit.cover,
              width: select ? size.width * 0.45 : size.width * 0.4,
            ),
            SizedBox(
              height: size.height * 0.05,
            ),
            Text(
              text,
              style: TextStyle(
                  fontSize: 50,
                  fontWeight: FontWeight.w900,
                  color: color,
                  shadows: [
                    Shadow(
                        color: Colors.black.withOpacity(0.16),
                        blurRadius: 6,
                        offset: Offset(0, 3))
                  ]),
            ),
          ],
        ),
      ),
    );
  }
}
